<template>
  <BaseAgGrid v-bind="gridOptions" />
</template>

<script setup lang="ts">
import BaseAgGrid from '@/components/BaseAgGrid.vue'
import { ref } from 'vue'
import { type GridOptions } from 'ag-grid-community'
import type { IOlympicData } from '@/views/types'
import json from './data/cus-cmp.json'

// 获取当前上下文注册的组件
// const instance = getCurrentInstance()
// console.log(instance?.type?.components)

const rowData = ref<IOlympicData[]>(json as IOlympicData[])
const gridOptions = ref<GridOptions<IOlympicData>>({
  rowData: json,
  columnDefs: [
    // 行 文字居中
    { field: 'name', cellStyle: { textAlign: 'center' } },
    { field: 'age' },
    {
      field: 'gender',
      cellRenderer: 'cusCmpARender',
      cellEditor: cusCmpARender,
      cellRendererParams: { rowData: rowData.value },
    },
    { field: 'phone' },
    { field: 'email' },
    { field: 'address' },
    { field: 'company' },
  ],
  defaultColDef: {
    flex: 1,
  },
  enableCellSpan: true,
})

import cusCmpARender from './components/cusCmpARender.vue'
defineExpose({
  cusCmpARender
})
</script>

<style scoped></style>
